<template>
  <view class="container">
    <uni-badge text="1"></uni-badge>
    <uni-badge text="2" type="success" @click="handleBadgeClick"></uni-badge>
    <uni-badge text="3" type="primary" :inverted="true"></uni-badge>
  </view>
</template>

<script setup>
const handleBadgeClick = () => {
  uni.showToast({
    title: 'Badge clicked',
    icon: 'none'
  });
};
</script>

<style scoped>
.container {
  padding: 20rpx;
}
</style> 